<template>
  <el-form :model="ruleForm" :rules="rules" ref="ruleForm">
    <!-- 更换轮胎预警配置-->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">更换轮胎预警配置 </span>
      </div>
      <el-row>
        <el-col :span="24">
          <el-form-item label-width="145px" label="车辆公里数预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">公里</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label-width="145px" label="更换轮胎工单预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>

    <!-- 上牌工单预警配置-->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">上牌工单预警配置 </span>
      </div>
      <el-row>
        <el-col :span="24">
          <el-form-item label-width="145px" label="上牌工单预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>

    <!-- 维修预警配置-->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">维修预警配置 </span>
      </div>
      <el-row>
        <el-col :span="24">
          <el-form-item label-width="145px" label="维修逾期提前预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>

    <!-- 装饰工单预警配置-->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">装饰工单预警配置 </span>
      </div>
      <el-row>
        <el-col :span="24">
          <el-form-item label-width="145px" label="装饰工单预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>

    <!-- 保养预警配置-->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">保养预警配置 </span>
      </div>
      <el-row>
        <el-col :span="24">
          <el-form-item label-width="145px" label="车辆公里数预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">公里</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label-width="145px" label="保养时长预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label-width="145px" label="保养工单未处理预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>

    <!-- 维修工单预警配置-->
    <el-card class="box-card last-card" shadow="never" >
      <div slot="header" class="header-card">
        <span class="header-card-title">维修工单预警配置 </span>
      </div>
      <el-row>
        <el-col :span="24">
          <el-form-item label-width="145px" label="维修工单预警:">
            <el-input v-model="ruleForm.name">
              <el-switch v-model="ruleForm.gpsExpireEnable" slot="prepend"/>
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>
  </el-form>
</template>

<script>
export default {
  name: "cwWarning",
  props: {
    value: {
      type: Object,
      default: {},
    },
  },
  computed: {
    ruleForm: {
      get() {
        let that = this
        const proxy = new Proxy(that.value, {
          get(target, key) {
            return Reflect.get(target, key)
          },
          set(target, key, value) {
            that.$emit('input', {...target, [key]: value})
            return true
          }
        })
        return proxy
      }
    },

  },
  watch: {},
  data() {
    return {
      rules: {}
    };
  },
  created() {
  },
  mounted() {
  },
  methods: {},
};
</script>

<style scoped lang="scss">
@import "@/styles/cwgd/formScss.scss";

::v-deep .el-input-group__prepend {
  background: white;
  padding: 0 10px;
}

::v-deep .el-input-group__append {
  background: white;
  padding: 0 10px;
}
::v-deep .last-card{
  margin-bottom: 0 !important;
}
</style>

